/*
 * @Date: 2025-06-13 10:50:10
 * @Auth: 463997479@qq.com
 * @LastEditors: 463997479@qq.com
 * @LastEditTime: 2025-09-26 11:31:24
 * @FilePath: \corpus\src\components\Priview\md.tsx
 */
import { Modal } from 'antd';
import type React from 'react';

import MDEditor from '@uiw/react-md-editor';
import { useModel } from '@umijs/max';
import { useEffect, useState } from 'react';

const MdEditor: React.FC<{ onChange: (val: any) => void }> = (props) => {
  const { mdVisible, setMdVisible, setType, setJsonData, jsonData } = useModel(
    'useTree',
    (model) => {
      return {
        mdVisible: model.mdVisible,
        setJsonData: model.setJsonData,
        jsonData: model.jsonData,

        setMdVisible: model.setMdVisible,
        setType: model.setType,
      };
    },
  );

  const title = '修改提示词';

  const [data, setData] = useState<any>(null);
  const handleSubmit = () => {
    setMdVisible(false);
    props?.onChange?.(jsonData);
  };

  useEffect(() => {
    if (mdVisible) {
      setData(jsonData);
    } else {
      setJsonData(null);
      setType('');
    }
  }, [mdVisible, jsonData]);

  return (
    <Modal
      width={700}
      title={title}
      open={mdVisible}
      onCancel={() => {
        setMdVisible(false);
      }}
      onOk={handleSubmit}
    >
      <div>
        {mdVisible && data && (
          <MDEditor
            height={600}
            value={data}
            onChange={(a) => {
              setJsonData(a);
            }}
          />
        )}
      </div>
    </Modal>
  );
};

export default MdEditor;
